<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .layui-form-radio {
            float: left;
        }

        ::-webkit-scrollbar-thumb {
            background-color: #009688;
        }
    </style>
</head>
<body>
<div class="layui-tab-content">

    <div>
        <div class="layui-input-inline" style="width: 300px;margin-right: 10px">
            <input type="text" id="activityTicketName" placeholder="券名称" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline">
            <button type="submit" class="layui-btn" id="activityTicketSearch">搜索</button>
        </div>
        <div class="layui-input-inline" style=" float: right;margin-right: 10%;">
            <button type="submit" class="layui-btn layui-btn-normal" id="activityTicketAdd">添加</button>
        </div>
    </div>
    <table class="layui-hide" id="activityTicketTable" lay-filter="activityTicketTable"></table>
</div>
</body>
<script type="text/html" id="activityTicketInfo">
    <form class="layui-form" style="white-space:nowrap!important;margin-top: 20px;margin-right: 20px"
          lay-filter="activityTicketInfoForm" id="activityTicketInfoForm">
        <input name="atId" id="atId" hidden="hidden">
        <div class="layui-form-item">
            <label class="layui-form-label required">活动类型:</label>
            <div class="layui-input-block">
                <select name="aatId" lay-verify="required" lay-filter="aatId" id="aatId">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">活动券名称:</label>
            <div class="layui-input-block">
                <input type="text" name="atName" autocomplete="off" placeholder="请输入活动券名称"
                       class="layui-input" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">活动券类型:</label>
            <div class="layui-input-block">
                <select name="stId" lay-verify="required" lay-filter="stId" id="stId">
                </select>
            </div>
        </div>
        <div class="layui-form-item" id="atCountInput">
            <label class="layui-form-label required">交付数量:</label>
            <div class="layui-input-block">
                <input name="atCount" min="0" style="height: auto;line-height: 38px;"
                       id="atCount" type="number" placeholder="数量"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">面值:</label>
            <div class="layui-input-inline">
                <input name="atMoney" id="atMoney" min="0"
                       style="width: 180px;display: initial;height: auto;line-height: 38px;"
                       type="number" placeholder="金额"
                       class="layui-input" lay-verify="required"/>
                <input name="atIntegral" id="atIntegral" min="0"
                       style="width: 180px;display: initial;height: auto;line-height: 38px;"
                       type="number" placeholder="积分"
                       class="layui-input" lay-verify="required"/>
            </div>
        </div>
        <div id="variableForm">
            <div class="layui-form-item">
                <label class="layui-form-label required" id="dateLabel">领取时间:</label>
                <div class="layui-input-inline">
                    <input type="text" name="atActivityDate" id="atActivityDate" class="layui-input"
                               placeholder=" - " style="width: 360px">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户类型:</label>
                <div class="layui-input-block">
                    <select id="atUserType"  name="atUserType" lay-filter="atUserType" lay-verify="required">
                        <option value="1">所有用户</option>
                        <option value="2">新用户</option>
                        <option value="3">指定用户</option>
                        <option value="4" id="daoluOption" disabled>批量导入指定用户</option>
                    </select>
                </div>
            </div>
            <div id="userList" hidden="hidden">
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">用户手机号码:</label>
                    <div class="layui-input-block">
                        <textarea name="atUserPhones" id="atUserPhones" placeholder="多个手机号码用,号隔开"
                                  class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item" id="uploadInput" hidden="hidden">
            <label class="layui-form-label required">导入操作:</label>
            <div class="layui-input-block" >
                <button type="button" class="layui-btn" id="daolu" >
                    <i class="layui-icon">&#xe62f;</i>导入模板文件
                </button>
                <button type="button" class="layui-btn" id="download" >
                    <i class="layui-icon">&#xe601;</i>下载模板文件
                </button>
            </div>
            <div class="layui-input-block" style="margin-top: 10px">
                <button type="button" class="layui-btn" id="daoluView">
                    <i class="layui-icon">&#xe621;</i>查看导入详情
                </button>
                <span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="daoluVieWmsg">未导入</span></span>
            </div>
        </div>

        <div class="layui-form-item" id="validityInput">
            <label class="layui-form-label required">有效期:</label>
            <div class="layui-input-block">

                <div style="margin-bottom: 20px;">
                    <input type="radio" name="validity" value="0" title="指定有效期" checked="">
                    <input style="width: 200px" type="text" class="layui-input" name="atValidDate" id="atValidDate"
                           placeholder=" - ">
                </div>

                <div>
                    <input type="radio" name="validity" value="1" title="领劵当天起">
                    <input id="atValidDay" name="atValidDay"
                           style="width: 200px;display: initial;height: auto;line-height: 38px;" type="number"
                           placeholder="请输入"
                           autocomplete="off"
                           class="layui-input"> 天有效
                </div>

            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">活动券说明:</label>
            <div class="layui-input-block">
                <textarea name="atExplain"  id="atExplain" placeholder="请输入活动券说明"
                          class="layui-textarea"></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">选择使用规则：</label>
            <div class="layui-input-block">
                <button style="margin-bottom: 10px;" type="button" class="layui-btn" id="activitySelectUseRule">选择使用规则
                </button>
                <input type="text" id="atUseRuleId" name="atUseRuleId" placeholder="规则"
                       style="display: none" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" id="ActivityTicketInfoBtn" style="margin-left: 110px;">
            <button type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" id="saveBtn">保存
            </button>
            <button type="button" class="layui-btn layui-btn-primary" id="closeBtn">取消</button>
        </div>
    </form>
</script>
<script type="text/html" id="daoluViewTableHtml">
    <div style="margin-left: 10px;margin-top: 10px">
        <button type="button" id="daoluViewButton" class="layui-btn">显示失败的数据</button>
        <button type="button" id="daoluViewRefresh" class="layui-btn">重置</button>
    </div>
    <table id="daoluViewTable" lay-filter="daoluViewTable"></table>
</script>

<!--&lt;!&ndash;领取&ndash;&gt;-->
<!--<script type="text/html" id="receiveForm">-->
<!--    <div class="layui-form-item">-->
<!--        <div class="layui-inline">-->
<!--            <label class="layui-form-label">领取时间:</label>-->
<!--            <div class="layui-input-inline">-->
<!--                <input type="text" name="atActivityDate" id="atActivityDate" class="layui-input" placeholder=" - ">-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div class="layui-form-item">-->
<!--        <div class="layui-inline">-->
<!--            <label class="layui-form-label">用户类型:</label>-->
<!--            <div class="layui-input-block">-->
<!--                <select id="atUserType" name="atUserType" lay-filter="atUserType" lay-verify="required">-->
<!--                    <option value="1">所有用户</option>-->
<!--                    <option value="2">新用户</option>-->
<!--                    <option value="3">指定用户</option>-->
<!--                </select>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div id="userList">-->

<!--    </div>-->
<!--    <div class="layui-form-item">-->
<!--        <label class="layui-form-label">有效期:</label>-->
<!--        <div class="layui-input-block">-->

<!--            <div style="margin-bottom: 20px;">-->
<!--                <input type="radio" name="validity" value="0" title="指定有效期" checked="">-->
<!--                <input style="width: 200px" type="text" class="layui-input" name="atValidDate" id="atValidDate"-->
<!--                       placeholder=" - ">-->
<!--            </div>-->

<!--            <div>-->
<!--                <input type="radio" name="validity" value="1" title="领劵当天起">-->
<!--                <input id="atValidDay" name="atValidDay"-->
<!--                       style="width: 200px;display: initial;height: auto;line-height: 38px;" type="number"-->
<!--                       placeholder="请输入"-->
<!--                       autocomplete="off"-->
<!--                       class="layui-input"> 天有效-->
<!--            </div>-->

<!--        </div>-->
<!--    </div>-->

<!--</script>-->
<!--赠送-->
<!--<script type="text/html" id="giveForm">-->
<!--    <div class="layui-form-item">-->
<!--        <div class="layui-inline">-->
<!--            <label class="layui-form-label">赠送时间:</label>-->
<!--            <div class="layui-input-inline">-->
<!--                <input type="text" name="atActivityDate" id="atActivityDate" class="layui-input" placeholder=" - ">-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div class="layui-form-item">-->
<!--        <div class="layui-inline">-->
<!--            <label class="layui-form-label">用户类型:</label>-->
<!--            <div class="layui-input-block">-->
<!--                <select id="atUserType" name="atUserType" lay-filter="atUserType" lay-verify="required">-->
<!--                    <option value="1">所有用户</option>-->
<!--                    <option value="2">新用户</option>-->
<!--                    <option value="3">指定用户</option>-->
<!--                </select>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--    <div id="userList">-->

<!--    </div>-->
<!--    <div class="layui-form-item">-->
<!--        <label class="layui-form-label">有效期:</label>-->
<!--        <div class="layui-input-block">-->

<!--            <div style="margin-bottom: 20px;">-->
<!--                <input type="radio" name="validity" value="" title="指定有效期" checked="">-->
<!--                <input style="width: 200px" type="text" class="layui-input" name="atValidDate" id="atValidDate"-->
<!--                       placeholder=" - ">-->
<!--            </div>-->

<!--            <div>-->
<!--                <input type="radio" name="validity" value="" title="领劵当天起">-->
<!--                <input name="atValidDay" id="atValidDay"-->
<!--                       style="width: 200px;display: initial;height: auto;line-height: 38px;" type="number"-->
<!--                       placeholder="请输入"-->
<!--                       autocomplete="off"-->
<!--                       min="0"-->
<!--                       class="layui-input"> 天有效-->
<!--            </div>-->

<!--        </div>-->
<!--    </div>-->
<!--</script>-->
<!--商城购买-->
<script type="text/html" id="purchaseForm">
    <!--    <div class="layui-form-item">-->
    <!--        <label class="layui-form-label">有效期:</label>-->
    <!--        <div class="layui-input-block">-->
    <!--            <div>-->
    <!--                购买后-->
    <!--                <input name="atValidDay" id="atValidDay"-->
    <!--                       style="width: 200px;display: initial;height: auto;line-height: 38px;" type="number"-->
    <!--                       placeholder="请输入"-->
    <!--                       min="0"-->
    <!--                       autocomplete="off"-->
    <!--                       class="layui-input"> 天有效-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
</script>

<script type="text/html" id="designatedUser">
    <!--    <div class="layui-form-item layui-form-text">-->
    <!--        <label class="layui-form-label">用户手机号码:</label>-->
    <!--        <div class="layui-input-block">-->
    <!--            <textarea placeholder="多个手机号码用,号隔开" class="layui-textarea"></textarea>-->
    <!--        </div>-->
    <!--    </div>-->
</script>
<script type="text/html" id="ActivityTicketEdit">
    <a class="layui-btn layui-btn-xs" lay-event="updateBtn">详情</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delBtn">删除</a>
</script>


<script type="text/html" id="activityUseRule">
    <div class="layui-tab-content">
        <div class="layui-input-inline" style="width: 300px;margin-right: 30px">
            <input type="text" id="activityUseRuleSearchName" placeholder="请输入规则名称" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline">
            <button type="submit" class="layui-btn" id="activityUseRuleSearch">搜索</button>
        </div>
        <table class="layui-hide" id="activityUseRuleTable" lay-filter="activityUseRuleTable"></table>
    </div>
</script>
<script type="text/html" id="activitySelectUseRuleEdit">
    <a class="layui-btn layui-btn-xs" lay-event="activitySelectUseRuleBtn" id="activitySelectUseRuleBtn">选择</a>
</script>
<script th:replace="/common/template :: script"></script>
<script th:inline="javascript">
    layui.use(['element', 'laydate', 'form', 'table', 'form', 'jquery','upload'], function () {
        var element = layui.element;
        var table = layui.table;
        var laydate = layui.laydate;
        var upload = layui.upload;
        var $ = layui.jquery;
        var form = layui.form;
        var activityTypeFormIndex = 1;
        var userTypeFormIndex = 0;
        var daoluView = [];
        table.render({
            elem: '#activityTicketTable'
            , url: '/activityTicket'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , cols: [[
                {field: 'atName', title: '活动券名称', align: 'center'} //width 支持：数字、百分比和不填写。你还可以通过 minWidth 参数局部定义当前单元格的最小宽度，layui 2.2.1 新增
                , {field: 'atCount', title: '数量', align: 'center'}
                , {field: 'atReceivedCount', title: '已发放数量', align: 'center'}
                , {
                    field: 'atUserType', title: '用户类型', align: 'center', templet: function (d) {
                        var str = '';
                        var state = d.atUserType;
                        if (state == 1) {
                            str = "<div>所有用户</div>"
                        } else if (state == 2) {
                            str = "<div>新用户</div>"
                        } else if (state == 3) {
                            str = "<div>指定用户</div>"
                        }else if (state == 4) {
                            str = "<div>批量导入指定用户</div>"
                        }
                        return str;
                    }
                }
                , {title: '操作', align: 'center', toolbar: '#ActivityTicketEdit'}
            ]]
            , page: true
        });
        //修改
        table.on('tool(activityTicketTable)', function (obj) {
            console.log(obj.data)
            if (obj.event === 'updateBtn') {
                showActivityTicketFrom(obj.data);
            } else if (obj.event === 'delBtn') {
                del(obj);
            }
        })

        // 删除
        function del(obj) {
            var y = $(window).height() - window.screen.height / 2;
            layer.confirm('确定要删除吗？', {
                offset: y,
                skin: 'layui-layer-admin'
            }, function (i) {
                layer.close(i);
                layer.load(2);
                $.ajax({
                    url: '/activityTicket/' + obj.data.atId,
                    method: 'Post',
                    data: {_method: 'DELETE'},
                    success: function (res) {
                        layer.closeAll('loading');
                        if (res.code == 200) {
                            layer.msg(res.msg, {icon: 1});
                            obj.del();
                        } else {
                            layer.msg(res.msg, {icon: 2});
                        }
                    }
                })
            });
        }

        //添加按钮
        $('#activityTicketAdd').click(function () {
            showActivityTicketFrom();
        })

        //搜索
        $('#activityTicketSearch').click(function () {
            var activityTicketName = $('#activityTicketName').val();
            table.reload('activityTicketTable', {where: {activityTicketName: activityTicketName}})
        })

        function showActivityTicketFrom(data) {
            activityTypeFormIndex = 1;
            userTypeFormIndex = 0;
            var index = layer.open({
                type: 1,
                area: ['500px', '600px'],
                maxmin: true,
                title: data ? '修改活动券' : '新增活动券',
                content: $('#activityTicketInfo').html(),
                success: function () {
                    daoluView = [];
                    //活动类型下拉框
                    $.ajax({
                        url: '/activityType',
                        method: 'get',
                        success: function (res) {
                            for (let i = 0; i < res.data.length; i++) {
                                if (data && data.aatId == res.data[i].activityTypeId) {
                                    $('#aatId').append(" <option selected value=\"" + res.data[i].activityTypeId + "\">" + res.data[i].activityTypeName + "</option>")
                                } else {
                                    $('#aatId').append(" <option value=\"" + res.data[i].activityTypeId + "\">" + res.data[i].activityTypeName + "</option>")
                                }
                            }
                            // renderReceiveForm();
                            //渲染select
                            form.render('select');
                        }
                    })
                    //服务类型下拉框
                    $.ajax({
                        url: '/service/type/integralMallType',
                        method: 'get',
                        success: function (res) {
                            for (let i = 0; i < res.data.length; i++) {
                                if (data && data.stId == res.data[i].serviceTypeId) {
                                    $('#stId').append(" <option selected value=\"" + res.data[i].serviceTypeId + "\">" + res.data[i].serviceTypeName + "</option>")
                                } else {
                                    $('#stId').append(" <option value=\"" + res.data[i].serviceTypeId + "\">" + res.data[i].serviceTypeName + "</option>")
                                }
                            }
                            //渲染select
                            layui.form.render('select');
                        }
                    })

                    //执行实例
                    //上传文件
                    var uploadInst = upload.render({
                        elem: '#daolu' //绑定元素
                        ,url: '/activityTicket/upload' //上传接口
                        ,accept: 'file'
                        ,done: function(res){
                            if(res.code == 500){
                                $("#daoluVieWmsg").text("导入失败")
                                return;
                            }
                            $("#daoluVieWmsg").text("导入成功")
                            daoluView = res.data;
                        }
                        ,error: function(){
                            //请求异常回调
                            $("#daoluVieWmsg").text("导入失败")
                        }
                    });
                    //下载
                    $("#download").click(function (){
                        var url = "/activityTicket/download";
                        window.open(url);
                    })

                    $("#daoluView").click(function () {
                        layer.open({
                            type: 1,
                            area: ['70%', '70%'],
                            maxmin: true,
                            title: '导入详情',
                            content: $('#daoluViewTableHtml').html(),
                            success: function () {
                                table.render({
                                    elem: '#daoluViewTable'
                                    ,data:daoluView
                                    ,page: true //开启分页
                                    ,cols: [[ //表头
                                        {field: 'name', title: '姓名'}
                                        ,{field: 'phone', title: '手机'}
                                        ,{field: 'integral', title: '积分'}
                                        ,{field: 'validPeriod', title: '有效期'}
                                        ,{field: 'status', title: '导入状态',
                                            templet: function(d){
                                                if(d.status == '1'){
                                                    return '正常';
                                                }else {
                                                    return '失败';
                                                }

                                            }
                                         }
                                        ,{field: 'msg', title: '错误说明'}
                                    ]]
                                    ,page: true
                                    ,limit: 5
                                    , done: function (res, curr, count) {
                                        console.log(res.data);
                                        var that = this.elem.next();
                                        console.log(this.elem)
                                        console.log(that)
                                        res.data.forEach(function (item, index) {
                                            if (item.status === "0") {
                                                var tr = that.find(".layui-table-box tbody tr[data-index='" + index + "']");
                                                tr.css("background-color", "yellow");
                                                tr.find(".laytable-cell-1-0-9").css("color","red");

                                            }
                                        });
                                    }
                                });
                                //显示失败的数据
                                $("#daoluViewButton").click(function () {
                                    var datas = []
                                    for(var i = 0; i<daoluView.length;++i){
                                        var data = daoluView[i];
                                        if(data.status == '0'){
                                            datas.push(data)
                                        }
                                    }
                                    table.reload('daoluViewTable', {
                                        data: datas,
                                        page: {
                                            curr: 1 //重新从第 1 页开始
                                        }
                                    }
                                    );
                                })
                                //刷新
                                $("#daoluViewRefresh").click(function () {
                                    table.reload('daoluViewTable', {
                                            data: daoluView
                                        }
                                    );
                                })

                            }
                        })
                    })
                    $('#activitySelectUseRule').click(function () {
                        loadUseRuleTable();
                    })

                    var atActivityDate = '';
                    var atValidDate = '';
                    //给表单赋值
                    if (data) {
                        // $("#activityTicketInfoForm :input").prop("readonly", "readonly");
                        $("#activityTicketInfoForm :input").prop("disabled", true);
                        $("#ActivityTicketInfoBtn").hide()
                        if (data.atActivityStartDate && data.atActivityEndDate) {
                            atActivityDate = data.atActivityStartDate + ' - ' + data.atActivityEndDate;
                        }

                        if (data.atValidStartDate && data.atValidEndDate) {
                            atValidDate = data.atValidStartDate + ' - ' + data.atValidEndDate;
                            $("input[name=validity][value='0']").prop("checked", "true");
                        } else {
                            $("input[name=validity][value='1']").prop("checked", "true");
                        }
                        form.val('activityTicketInfoForm', data);
                        switchActivityType(data.aatId, atActivityDate, atValidDate);
                        debugger
                        switchUserType(data.atUserType==4?3:data.atUserType);
                        if (data.atUseRuleName) {
                            $('#activitySelectUseRule').text(data.atUseRuleName)
                        }
                        // var a = $('input[name=atValidDate]');
                        // a.val('2018-01-01 - 2018-01-23')
                    }
                    //有效时间
                    laydate.render({
                        elem: '#atValidDate'
                        , trigger: 'click'
                        , range: true
                        , value: atValidDate
                    });
                    //领取时间
                    laydate.render({
                        elem: '#atActivityDate'
                        , trigger: 'click'
                        , range: true
                        , value: atActivityDate
                    });
                    form.render('radio');
                    form.render('select');


                    form.on('submit(saveBtn)', function (form) {

                        var atCount = $("#atCount").val();
                        if(!atCount){
                            if (userTypeFormIndex !=4) {
                                layer.msg('交付数量不能为空', {icon: 2});
                                return false;
                            }
                        }

                        if (activityTypeFormIndex != 3) {
                            if (form.field.atActivityDate == '') {
                                if (activityTypeFormIndex == 1) {
                                    layer.msg('领取时间不能为空', {icon: 2});
                                } else if (activityTypeFormIndex == 2) {
                                    layer.msg('赠送时间不能为空', {icon: 2});
                                }
                                return false;
                            }
                        }

                        if (form.field.validity == 0) {
                            //导入类别时比不用手动输入
                            if(userTypeFormIndex ==4){
                                form.field.daoluData = JSON.stringify(daoluView);
                            }else {
                                if (form.field.atValidDate == '') {
                                    layer.msg('有效期不能为空', {icon: 2});
                                    return false;
                                }
                            }
                            //指定有效时间
                            form.field.atValidDay = '';
                        } else {
                            if (form.field.atValidDay == '') {
                                layer.msg('有效天数不能为空', {icon: 2});
                                return false;
                            }
                            //指定有效天数
                            form.field.atValidDate = '';
                        }
                        console.log(form);
                        // layer.load(2);
                        // var formData = new FormData();
                        $.ajax({
                            url: '/activityTicket',
                            method: data ? 'Put' : 'Post',
                            data: form.field,
                            success: function (res) {
                                layer.closeAll();
                                if (res.code == 200) {
                                    layer.msg(res.msg, {icon: 1});
                                    table.reload('activityTicketTable')
                                } else {
                                    layer.msg(res.msg, {icon: 2});
                                }
                            }
                        })
                        return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
                    });
                    $('#closeBtn').click(function () {
                        layer.close(index);
                    })
                }
            })
        }


        function switchActivityType(value, atActivityDate, atValidDate) {
            userTypeFormIndex = 0;
            //除了赠送分类 导入模块都隐藏
            $('#uploadInput').hide()
            if(value == 2){
                $("#daoluOption").removeAttr("disabled");
                if(userTypeFormIndex !=4){
                    $('#atCountInput').show()
                }
            }else {
                $('#atCountInput').show()
                $("#daoluOption").attr("disabled","disabled");
            }
            form.render('select');
            //领取
            if (value == 1) {
                if (activityTypeFormIndex != 1) {
                    renderReceiveForm(atActivityDate, atValidDate)
                }
                //赠送
            } else if (value == 2) {
                if (activityTypeFormIndex != 2) {
                    var options= $('#atUserType option:selected');
                    //导入模块显现隐藏
                    if(options.val() == 4){
                        $('#uploadInput').show()
                    }
                    renderVariableForm(atActivityDate, atValidDate);
                }
                //积分商城购买
            } else if (value == 3) {
                if (activityTypeFormIndex != 3) {
                    // var html = $('#purchaseForm').html()
                    // $('#variableForm').html(html)
                    $('#variableForm').hide()
                    activityTypeFormIndex = 3;
                }
            }
        }

        function switchUserType(value) {
            //所有用户
            if (value == 1) {
                if (userTypeFormIndex != 1) {
                    $('#userList').hide()
                    $('#validityInput').show()
                    // $('#userList').html('')
                    userTypeFormIndex = 1;
                }
                //新用户
            } else if (value == 2) {
                if (userTypeFormIndex != 2) {
                    $('#userList').hide()
                    $('#validityInput').show()
                    // $('#userList').html('')
                    userTypeFormIndex = 2;
                }
                //指定用户
            } else if (value == 3) {
                if (userTypeFormIndex != 3) {
                    $('#userList').show()
                    $('#uploadInput').hide()
                    $('#validityInput').show()
                    // var html = $('#designatedUser').html()
                    // $('#userList').html(html)
                    userTypeFormIndex = 3;
                }
            }else if (value == 4) {
                if (userTypeFormIndex != 4) {
                    $('#userList').show()
                    $('#uploadInput').show()
                    $('#validityInput').hide()
                    $('#userList').hide()
                    $('#atCountInput').hide()
                    // var html = $('#designatedUser').html()
                    // $('#userList').html(html)
                    userTypeFormIndex = 4;
                }
            }
            if(userTypeFormIndex !=4){
                $('#atCountInput').show()
            }
        }

        form.on('select(aatId)', function (data) {
            switchActivityType(data.value);
        });

        form.on('select(atUserType)', function (data) {
            switchUserType(data.value);
        });


        //赠送
        function renderVariableForm(atActivityDate, atValidDate) {
            $('#variableForm').show()
            $('#dateLabel').text("赠送时间:")
            activityTypeFormIndex = 2
            // var html = $('#giveForm').html()
            // $('#variableForm').html(html)
            // activityTypeFormIndex = 2;
            // //有效时间
            // laydate.render({
            //     elem: '#atValidDate'
            //     , trigger: 'click'
            //     , range: true
            //     , value: atValidDate
            // });
            // //领取时间
            // laydate.render({
            //     elem: '#atActivityDate'
            //     , trigger: 'click'
            //     , range: true
            //     , value: atActivityDate
            // });
            // form.render('radio');
            // form.render('select');
        }

        //领取
        function renderReceiveForm(atActivityDate, atValidDate) {
            $('#variableForm').show()
            $('#dateLabel').text("领取时间:")
            activityTypeFormIndex = 1;
            // var html = $('#receiveForm').html()
            // $('#variableForm').html(html)
            // activityTypeFormIndex = 1;
            // //有效时间
            // laydate.render({
            //     elem: '#atValidDate'
            //     , trigger: 'click'
            //     , range: true
            //     , value: atValidDate
            // });
            // //领取时间
            // laydate.render({
            //     elem: '#atActivityDate'
            //     , trigger: 'click'
            //     , range: true
            //     , value: atActivityDate
            // });
            // form.render('radio');
            // form.render('select');
        }


        function loadUseRuleTable() {
            var index = layer.open({
                type: 1,
                area: ['750px', '600px'],
                maxmin: true,
                title: '选择规则',
                content: $('#activityUseRule').html(),
                success: function () {
                    table.render({
                        elem: '#activityUseRuleTable'
                        , url: '/useRules'
                        , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        , cols: [[
                            {field: 'useRuleName', title: '规则名称', align: 'center'} //width 支持：数字、百分比和不填写。你还可以通过 minWidth 参数局部定义当前单元格的最小宽度，layui 2.2.1 新增
                            , {field: 'useRuleCreateDate', title: '创建时间', align: 'center'}
                            , {field: 'useRuleDescribe', title: '规则描述', align: 'center'}
                            , {title: '操作', align: 'center', toolbar: '#activitySelectUseRuleEdit'}
                        ]]
                        , page: true
                    });

                    $('#activityUseRuleSearch').click(function () {
                        var searchName = $('#activityUseRuleSearchName').val();
                        table.reload('activityUseRuleTable', {where: {searchName: searchName}})
                    })

                    table.on('tool(activityUseRuleTable)', function (obj) {
                        if (obj.event === 'activitySelectUseRuleBtn') {
                            $('#atUseRuleId').val(obj.data.useRuleId);
                            $('#activitySelectUseRule').text(obj.data.useRuleName);
                            layer.close(index);
                        }
                    })
                }
            })
        }

    })
</script>
</html>
